@extends('layouts.admin.application')

@section('css')
    <link rel="stylesheet" href="/vendor/daterangepicker/daterangepicker.css">
@endsection

@section('content')

    <div class="admin-content">

        <div class="am-cf am-padding">
            <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">新增活动</strong> /
                <small>Create</small>
            </div>
        </div>
        <hr>
        @include('admin._flash')

        <div class="am-g">
            <div class="am-u-sm-12 am-u-md-12">

                <form class="am-form" action="/admin/active/{{$active->id}}" method="post">
                    {{ csrf_field() }}
                    {{ method_field('PUT') }}


                    <div class="am-g am-margin-top">
                        <div class="am-u-sm-4 am-u-md-2 am-text-right">
                            所属门店
                        </div>
                        <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                            <select  data-am-selected="{btnWidth: '100%',  btnStyle: 'secondary', btnSize: 'sm', maxHeight: 360, searchBox: 1}"
                                     name="store_id">
                                <option value="">请选择</option>
                                @foreach($cates as $c)
                                    <option value="{{$c->id}}" @if($c->id == $active->store_id) selected @endif>{{$c->name}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <div class="am-g am-margin-top sort">
                        <div class="am-u-sm-4 am-u-md-2 am-text-right">
                            标题
                        </div>
                        <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                            <input type="text" name="title" value="{{$active->title}}" class="am-input-sm"placeholder="请输入标题">
                        </div>
                    </div>
                    <div class="am-g am-margin-top sort">
                        <div class="am-u-sm-4 am-u-md-2 am-text-right">
                            简介
                        </div>
                        <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                            <textarea rows="4" name="active_about"   placeholder="请输入简介">{{$active->active_about}}</textarea>
                        </div>
                    </div>
                    <div class="am-g am-margin-top sort">
                        <div class="am-u-sm-4 am-u-md-2 am-text-right">
                            规则
                        </div>
                        <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                            <textarea rows="4" name="active_rule"  placeholder="请输入规则">{{$active->active_rule}}</textarea>
                        </div>
                    </div>



                    <div class="am-g am-margin-top sort">
                        <div class="am-u-sm-4 am-u-md-2 am-text-right">
                            活动开始时间-结束时间
                        </div>
                        <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                            <input type="text" name="date" id="date_start" value="{{$active->active_start}}至{{$active->active_end}}" class="am-input-sm " value="" placeholder="点击选择开始时间结束时间"  >
                        </div>
                    </div>

                    <div class="am-g am-margin-top sort">
                        <div class="am-u-sm-4 am-u-md-2 am-text-right">
                            成功打卡数
                        </div>
                        <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                            <input type="text" name="use_number" value="{{$active->use_number}}"  class="am-input-sm"placeholder="完成活动所需的打卡数，10次则填写10">
                        </div>
                    </div>

                    <div class="am-g am-margin-top">
                        <div class="am-u-sm-4 am-u-md-2 am-text-right">
                            奖励优惠券
                        </div>
                        <div class="am-u-sm-8 am-u-md-4 am-u-end col-end">
                            <th>@foreach($coupons as $c)
                                    <label class="am-btn am-btn-default am-btn-xs am-round" >
                                        <input type="radio" name="coupon_id" value="{{$c->id}}" @if($c->id == $active->coupon_id) checked @endif > {{$c->ratio}}折,适用范围：@foreach($c->types as $t){{$t->name}}_ @endforeach
                                    </label><br>
                                @endforeach
                            </th>
                        </div>
                    </div>
                    {{--<div class="am-g am-margin-top sort">--}}
                    {{--<div class="am-u-sm-4 am-u-md-2 am-text-right">--}}
                    {{--结束时间--}}
                    {{--</div>--}}
                    {{--<div class="am-u-sm-8 am-u-md-4 am-u-end col-end">--}}
                    {{--<input type="text" name="sort_order" class="am-input-sm" value="" placeholder="点击选择结束时间" >--}}
                    {{--</div>--}}
                    {{--</div>--}}










                    <div class="am-margin">
                        <button type="submit" class="am-btn am-btn-primary am-radius">提交保存</button>
                    </div>
                </form>
            </div>
        </div>
    </div>


@endsection
@section('js')
    <script src="/vendor/daterangepicker/moment.js"></script>
    <script src="/vendor/moment/locale/zh-cn.js"></script>
    <script src="/vendor/daterangepicker/daterangepicker.js"></script>

    <script>
        $(function () {
            //时间插件
            $('#date_start').daterangepicker({

                "autoUpdateInput": false,
                "autoApply": true,
                "locale": {
                    "format": "YYYY-MM-DD",
                    "applyLabel": "确定",
                    "cancelLabel": "取消"
                }
            }, function (start, end, label) {
                this.element[0].value = start.format('YYYY-MM-DD') + ' ~ ' + end.format('YYYY-MM-DD');
            });
        });

    </script>
@endsection